<template>
  <div class="box">
    <header class="header">
      <van-nav-bar
        title="注册"
        left-arrow
        @click-left="$router.back()"
      >
      </van-nav-bar>
    </header>
    <div class="content">
      <van-field v-model="password"  placeholder="请输入密码" clearable/>
      <van-button :disabled="flag" type="danger" block @click="register">注册</van-button>
      至少为6位，至少包含一个大写字母和一个小写字母，包含数字
    </div>
  </div>
</template>
<script>
import Vue from 'vue'
import { Field, Button, NavBar } from 'vant'
import { getStorage } from '@/utils/storage'
import { dofinishregister } from '@/api/user'
Vue.use(Field)
Vue.use(Button)
Vue.use(NavBar)
export default {
  beforeRouteEnter (to, from, next) { // 组件内导航守卫
    const reg = /^(?:(?:\+|00)86)?1(?:(?:3[\d])|(?:4[5-79])|(?:5[0-35-9])|(?:6[5-7])|(?:7[0-8])|(?:8[\d])|(?:9[189]))\d{8}$/
    if (reg.test(getStorage('tel'))) {
      next()
    } else {
      // next('/reg_step1') XXXXXXX
      // next 默认为push
      next({
        path: '/reg_step1',
        replace: true
      })
    }
  },
  data () {
    return {
      password: ''
    }
  },
  methods: {
    register () {
      dofinishregister({
        tel: getStorage('tel'),
        password: this.password
      }).then(res => {
        // 注册成功，返回登录页面
        this.$router.go(-3) // 1-2-3 都是push来
        // detail login 1 2 3
        // 如果1-2-3 使用的是replace  this.$router.back()
      })
    }
  },
  computed: {
    flag () {
      return !/^\S*(?=\S{6,})(?=\S*\d)(?=\S*[A-Z])(?=\S*[a-z])\S*$/.test(this.password)
    }
  }
}
</script>
